<template>
    <el-dialog :close-on-click-modal="false" v-model="centerDialogVisible" title="控制点新增" width="720" align-center
        @close="centerDialogVisible1">
        <el-form :inline="true" :model="formInline" class="demo-form-inline">
            <el-form-item label="站点名称" label-width='85'>
                <el-input v-model="formInline.schemeName" placeholder="" clearable :disabled="!isSwitchOn" />
            </el-form-item>
            <el-form-item label="日期" label-width='85'>
                <el-date-picker v-model="formInline.riqi" type="date" placeholder="" @change="dialogDeitTime" clearable />
            </el-form-item>
            <el-form-item label="浮动值" label-width='85'>
                <el-input v-model="formInline.float" placeholder="" clearable :disabled="!isSwitchOn"/>
            </el-form-item>
            <el-form-item label="中心值" label-width='85'>
                <el-input v-model="formInline.center" placeholder="" clearable :disabled="!isSwitchOn"/>
            </el-form-item>
            <el-form-item label="监测点id" label-width='75'>
                <el-input v-model="formInline.pointid" placeholder="" clearable :disabled="!isSwitchOn"/>
            </el-form-item>
            <ProgramTable :formNumbers="{float: formInline.float, center: formInline.center }" @save-edit="handlesSaveEdit" style="height: 400px;"></ProgramTable>
            
        </el-form>        
        <template #footer>
            <div class="dialog-footer">
                <el-button @click="centerDialogVisible1">取消</el-button>
                <el-button type="primary" @click="onSubmit">
                    确定
                </el-button>
            </div>
        </template>
    </el-dialog>
</template>
<script setup>
import { ref, defineProps, defineEmits, reactive } from 'vue'
import { DyprojectManageEdit,postaddSiteLimit } from '../../src/http/http'
import { ElMessage } from 'element-plus'
import ProgramTable from '../components/ProgramTable.vue'
// import {   PlanTable } from '../../src/views/theme/ProgramManage.vue'

const props = defineProps({
    DialogIsgs: { type: Boolean, default: false },
    // tableID: { type: String, default:() => null }
})

const emit = defineEmits(['dyCpLimitTable','onSubmitRigth']);

const programTableData = ref(null);

const centerDialogVisible = ref(true)

const isSwitchOn = ref(true)
 
const chinaTime = ref('')
const formInline = reactive({
    schemeName: '',//控制点名称
    schemeCode: '',//控制点编码
    schememode: '',
    timeinterval: '',
    disposalpersonnel: '',
    user: '',
    delivery: true,
    resource:'',
    date:'',
    riqi:'',
    sensorCode:'',//传感器编码
    float:'',//浮动值
    center:'',//中心值值
    // schemeorder: true,
})


function dialogDeitTime(time){
// console.log(time,'time');
const date = new Date(time);
const options = { timeZone: "Asia/Shanghai", year: "numeric", month: "2-digit", day: "2-digit" };
  const formattedDate = date.toLocaleDateString("zh-CN", options).replace(/\//g, '-');
  chinaTime.value = formattedDate;
console.log(chinaTime.value);

}

const onSubmit = () => {
    emit('onSubmitRigth', false)
const siteId = localStorage.getItem('siteId');
console.log(siteId);

if(!siteId) return
console.log(siteId, '1111111111111')
const newData = programTableData.value.reduce((acc, item) => {
  // 创建 lowlimit 对象
  const lowlimitItem = {
    timeperiod: item.timeperiod,
    limitmedian: Number(formInline.center),
    limitfloat:Number( formInline.float),
    lowlimit: item.lowlimit,
    remark: 'low',
    monitorName: formInline.schemeName,
    schemeId:siteId,
    dateTimes: chinaTime.value ,
  };

  // 创建 highlimit 对象
  const highlimitItem = {
    timeperiod: item.timeperiod,
    limitmedian:  Number(formInline.center),
    limitfloat:Number( formInline.float),
    highlimit: item.highlimit,
    remark: 'high',
    monitorName: formInline.schemeName,
    schemeId:siteId,
    dateTimes: chinaTime.value ,
  };

  // 把这两条数据加入结果数组
  acc.push(lowlimitItem, highlimitItem);

  return acc;
}, []);

console.log(newData);

postaddSiteLimit(newData).then((res)=>{
console.log(res);
if (res.status === 200) {
    window.location.reload();
}
})
}



const handlesSaveEdit = (tableData) => {
    programTableData.value = tableData
}

function centerDialogVisible1() {
    emit('dyCpLimitTable', false)
}

function dialogData() {
    return {
        "dataChange": [
            {
                "ChangeType": "Modify",
                "ChangeInfo": {
                    "DataId":props.tableID,
                    "schemeName": formInline.schemeName,
                    "schemeCode": formInline.schemeCode,
                    "schememode": formInline.schememode,
                    "timeinterval": formInline.timeinterval,
                    "disposalpersonnel": formInline.disposalpersonnel,
                    "schemeorder": formInline.delivery
                }
            }
        ],
        "variableChange": null
    }
}
{

}


function centerDialogVisible2() {
  
  

    // dialogData()
    // console.log(dialogData(), 'ggg');

    // emit('dyCLimitTable', false)
    // // console.log(padialogDatarams,'parms');
    // DyprojectManageEdit(dialogData()).then((res) => {
    //     console.log(res, '新增');
    //     if (res.status === 200) {
    //         ElMessage({
    //             message: '新增成功',
    //             type: 'success',
    //         })
    //         // PlanTable()
    //         window.location.reload();
    //     }
    // });

}
</script>

<style scoped>
.demo-form-inline .el-input {
    --el-input-width: 220px;
}

.demo-form-inline .el-select {
    --el-select-width: 220px;
}

.demo-form-inline {
    display: flex;
    flex-wrap: wrap;
    justify-content:  space-between;
    align-items: center;
    width: 100%;
}

.demo-form-inline .el-form-item {
    display: flex;
    align-items: center;
    margin: 10px;
    flex: 1;
    min-width: 200px;
}

::v-deeep .el-form-item__label{
    width: 75px !important;
}

.demo-form-inline .el-input,
.demo-form-inline .el-select {
    width: 200px;
}


</style>